<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/context/mytags.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>客户达标情况</title>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery/jquery.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/plupload/plupload.full.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery/jquery-ui/jquery-ui.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/date/laydate/laydate.js"></script>
<script src="${pageContext.request.contextPath}/js/bootstrap/bootstrap.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/ui/table/bootstrap-table.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/ui/table/locale/bootstrap-table-zh-CN.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/ui/table/plugins/tableExport.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/ui/table/plugins/table-export.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/ui/table/plugins/jquery.base64.js" type="text/javascript"></script>

<script src="${pageContext.request.contextPath}/ui/layui/layui.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/ui/layui/lay/modules/laydate.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/ui/layui/lay/modules/layer.js" type="text/javascript"></script>
 <script src="${pageContext.request.contextPath}/ui/layui/lay/modules/form.js" type="text/javascript"></script>
 <link rel="stylesheet" href="${pageContext.request.contextPath}/ui/layui/css/modules/laydate/laydate.css" >
 <link rel="stylesheet" href="${pageContext.request.contextPath}/css/jquery-css/jquery-ui.css">
 <link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap-css/bootstrap.css">
<link rel="stylesheet" href="${pageContext.request.contextPath}/ui/table/bootstrap-table.css">
<link rel="stylesheet" href="${pageContext.request.contextPath}/ui/layui/css/layui.css" >
<link rel="stylesheet" href="${pageContext.request.contextPath}/ui/layui/css/global.css" >
<link rel="stylesheet" href="${pageContext.request.contextPath}/ui/layui/css/modules/layer/default/layer.css" >
 <link rel="stylesheet" href="${pageContext.request.contextPath}/ui/layui/css/modules/code.css" >


 <style>
  .container{
   	width:85%;
   	
  }
  
  .modal-industry{
  	width:700px;
  }
  .modal-body{
    max-height:750px
  }
   .modal-body-industry{
  	height:450px;
  }
 </style>
<script>
layui.use('laydate', function(){
  var laydate = layui.laydate;
  var startTime = {
     min: '1970-01-01 23:59:59'
    ,max: laydate.now(-1)
    ,isyes: true
    
  };
  var endTime = {
		     min: '1970-01-01 23:59:59'
		    ,max: laydate.now()
		    ,isyes: true
		    
		  };
  document.getElementById('ptime').onclick = function(){
	startTime.elem = this
    laydate(startTime);
  }
  document.getElementById('endtime').onclick = function(){
		endTime.elem = this
	    laydate(endTime);
	  }
  
});
</script>	
</head>

<body>
<%@include file="/webpage/frame/top.jsp" %>
<div class="container">
	<div id="topContent" class="layui-form-pane">
		<div class="layui-form-item" style="margin-bottom:0px ">
		 <div class="layui-inline">
		      <label class="layui-form-label"><input type="button" value="按日期查询" onclick="getbytime();"></label>
		       &nbsp;&nbsp;
		      <div class="layui-input-inline" style="margin-left:5px; ">
		        <input type="text" name="ptime" id="ptime" placeholder="开始时间">
		      </div>
		      &nbsp;&nbsp;
		      <div class="layui-input-inline" style="margin-left:5px; ">
		        <input type="text" name="endtime" id="endtime" placeholder="结束时间">
		      </div>
		    </div>		
		
		</div>
	</div>		
     
		<table id="companyGoaltable"  data-show-refresh="true"
               data-search="true"
               data-click-to-select="true"
               data-show-export="true"
               data-query-params="queryParams"
			   data-pagination="true"		   
               data-toolbar=".toolbar" 
               data-show-columns="true"
               data-sort-name="avgDayConsultGoal" 
               data-sort-order="desc" 
               >
            <thead>
            <tr>
            	<th data-field="state" data-radio="true"></th>
            	<th data-field="companyId" data-show="true" data-visible="false">公司id</th>
                <th data-field="companyName" data-sortable="true">客户公司名称</th>
                <th data-field="userId" data-sortable="true" data-visible="false">客服id</th>
                <th data-field="userName" data-sortable="true">负责客服</th>
                <th data-field="industryId" data-sortable="true" data-visible="false">所属行业id</th>
                <th data-field="industryName" data-sortable="true">所属行业名称</th>
                <th data-field="avgDayConsult" data-sortable="true">日均咨询量</th>
                <th data-field="avgDayConsultGoal" data-sortable="true">日均咨询量目标</th>
                <th data-field="isConsultGoal" data-sortable="true">日均咨询量是否达标</th>
                <th data-field="avgDayConversionCost" data-sortable="true">日均转化成本</th>
                <th data-field="avgDayConversionCostGoal" data-sortable="true">日均转化成本目标</th>
                <th data-field="isConversionGoal" data-sortable="true">日均转化成本是否达标</th>
                <th data-field="promotionDate">推广日期</th>
            </tr>
            </thead>
			
		</table>
		<font color="#FF0000">注：-1表示无穷大 , -2表示无数据</font>
</div>		
	
<!-- 上传组件初始化代码 -->
<script>

    var API_URL = '${pageContext.request.contextPath}/industryGoalController.do?getCompanys&ptime=null&endtime=null';
			
    //加载行业列表
	var $table = $('#companyGoaltable').bootstrapTable(
   		{
   			url: API_URL,
   			pageSize:25,
   			pageList : [15, 25, 100, 500]
   		}   		  
  		 ),     
       $modal = $('#modal').modal({show: false}),
       $alert = $('.alert').hide(),
	   $alert_input = $('.alert_input').hide();
	
    
	
	function getbytime(){
		var ptime = $('#ptime').val();
		var endtime = $('#endtime').val();
		var APT_M_URL = '${pageContext.request.contextPath}/industryGoalController.do?getCompanys&ptime='+ptime+'&endtime='+endtime;
		 
		 if(ptime==""&&endtime==""){
			 var opt = {
				        url: APT_URL
				    };
			 $("#companyGoaltable").bootstrapTable('refresh', opt);
		 }else{
			  var opt = {
				        url: APT_M_URL
				    };
			$("#companyGoaltable").bootstrapTable('refresh', opt);
		 }
		 
		
			  
			

		
	}

   
	

    function queryParams(params) {
        return {};
    }

 

    // update and delete events
    window.actionEvents = {
        'click .update': function (e, value, row) {
        	showModal_update($(this).attr('title'), row);
        }
        
    };

    //弹出窗口-创建
    function showModal(title, row) {
        row = row || {
        	id: '',
            industryName: ''
            
        }; // default row value

        $modal.data('id', row.id);
        $modal.find('.modal-title').text(title);
        
        for (var name in row) {
            $modal.find('input[name="' + name + '"]').val(row[name]);

        }
		
        $modal.modal('show');
    }
    
    //弹出窗口-修改
    function showModal_update(title, row) {
        row = row || {
        	industryId: '',
            industryName: ''
            
        }; // default row value

        $modal.data('id', row.id);
        $modal.find('.modal-title').text(title);
        
        for (var name in row) {
            $modal.find('input[name="' + name + '"]').val(row[name]);
        } 

                
    	$modal.modal('show');
    }   
    function showAlert(title, type) {
        $alert.attr('class', 'alert alert-' + type || 'success')
              .html('<i class="glyphicon glyphicon-check"></i> ' + title).show();
        setTimeout(function () {
            $alert.hide();
        }, 3000);
    }
    
    function showAlertModal(title, type) {
    	
    	$alert_input.attr('class', 'alert alert-' + type || 'success')
              .html('<i class="glyphicon glyphicon-check"></i> ' + title).show();
    	 setTimeout(function () {
    		 	$alert_input.hide();
         }, 3000);
        
    }    
    

    
   
</script>
<%@include file="/webpage/frame/bottom.jsp" %>
</body>
</html>